<template>
	<view :class="productConClass">
		<view v-if="storeInfo.id">
			<!-- 轮播图 -->
			<product-con-swiper :img-urls="storeInfo.sliderImageArr"></product-con-swiper>

			<!-- 商品信息描述 -->
			<view class="wrapper">
				<view class="share acea-row row-between row-bottom">
					<view class="money font-color-red">
						<!-- <text>￥</text> -->
						<text class="num">{{ storeInfo.vipPrice }}豆</text>
						<text class="vip-money" v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0">
							<!-- {{
              attr.productSelect.price || storeInfo.price
            }} 
			{{ attr.productSelect.vipPrice || storeInfo.vipPrice }}-->
						</text>
						<text class="zkj" v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0">专属优惠</text>
					</view>
				</view>
				<view class="introduce">{{ storeInfo.storeName }}</view>
				<view class="label acea-row row-between-wrapper">
					<text>原价:{{ storeInfo.otPrice }}豆</text>
					<!-- <text>库存:{{ storeInfo.stock }}{{ storeInfo.unitName }}</text> -->
					<text>
						销量:{{ storeInfo.sales }}
						<!-- {{ storeInfo.unitName }} -->
					</text>
				</view>
				<view class="coupon acea-row row-between-wrapper" @click="couponTap" v-if="couponList.length">
					<text class="hide line1">
						<text>优惠券：</text>
						<text class="activity" v-for="(item, couponListEq) in couponList" :key="couponListEq">满{{ item.useMinPrice }}减{{ item.couponPrice }}</text>
					</text>
					<view class="iconfont icon-jiantou"></view>
				</view>
			</view>

			<!-- 运费 -->
			<div class="attribute acea-row row-between-wrapper">
				<div>
					送货方式：
					<span class="atterTxt">{{ tempName }}</span>
				</div>
				<!-- <span>运费：{{postage}}元</span> -->
			</div>

			<!-- 规格 -->
			<view class="attribute acea-row row-between-wrapper" @click="selecAttrTap">
				<view>
					<text>{{ attrTxt }}：</text>
					<text class="atterTxt">{{ attrValue }}</text>
				</view>
				<view class="iconfont icon-jiantou"></view>
			</view>

			<!-- 门店信息 -->
			<!-- <view class="store-info" v-if="systemStore">
        <view class="title acea-row row-between-wrapper">
          <view>门店信息</view>
          <text @click="goStoreList()" class="praise">
            更多
            <text class="iconfont icon-jiantou"></text>
          </text>
        </view>
        <view class="info acea-row row-between-wrapper">
          <view class="picTxt acea-row row-between-wrapper">
            <view class="pictrue">
              <image :src="systemStore.image" />
            </view>
            <view class="text">
              <view class="name line1">{{ systemStore.name }}</view>
              <view
                class="address acea-row row-middle"
                @click="showChang(systemStore)"
              >
                <text class="addressTxt">{{ systemStore.address }}</text>
                <text class="iconfont icon-youjian"></text>
              </view>
            </view>
            <view class="addressBox">
              <a
                class="iconfont icon-dadianhua01 font-color-red phone"
                @click="telPhone(systemStore.phone)"
              ></a>
              <view class="addressTxt corlor-yshop"
                >距离{{ systemStore.distance }}千米</view
              >
            </view>
          </view>
        </view>
      </view> -->

			<!-- 商户信息 -->
			<view class="store-info" v-if="merchantInfo">
				<view class="title acea-row row-between-wrapper">
					<view>商户信息</view>
					<text @click="goShopAllList()" class="praise">
						全部商品
						<text class="iconfont icon-jiantou"></text>
					</text>
				</view>
				<!-- <view class="info acea-row row-between-wrapper">
					<view class="picTxt acea-row row-between-wrapper">
						<view class="pictrue"><image :src="merchantInfo.logoUrl" /></view>
						<view class="text">
							<view class="name line1">{{ merchantInfo.merchantName }}</view>
							<view class="address acea-row row-middle">
								<text class="addressTxt">{{ merchantInfo.city }}{{ merchantInfo.district }}{{ merchantInfo.address }}</text>
								<text class="iconfont icon-youjian"></text>
							</view>
						</view>
						<view class="addressBox">
							<a class="iconfont icon-dadianhua01 font-color-red phone" @click="telPhone(merchantInfo.linkTel)"></a>
							<view class="addressTxt corlor-yshop"></view>
						</view>
					</view>
				</view> -->
			</view>
			<view class="store-info" v-if="parameters != null">
				<view class="title row-between-wrapper">
					<view style="text-align:center;color: #f57a37 ;">规格参数</view>
				</view>
				<view class="canshu">
					<view class="canshu-q" v-for="(item,index) in parameters" :key="index">
						<view class="canshu-w">
							{{item.name}}
						</view>
						<view class="canshu-r">
							{{item.value}}
						</view>
					</view>
				</view>
			</view>
			<!-- 用户评价 -->
			<view class="userEvaluation" v-if="replyCount">
				<view class="title acea-row row-between-wrapper">
					<view>用户评价({{ replyCount }})</view>
					<text @click="goEvaluateList(id)" class="praise">
						<text class="font-color-red">{{ replyChance }}%</text>
						好评率
						<text class="iconfont icon-jiantou"></text>
					</text>
				</view>
				<user-evaluation :reply="reply"></user-evaluation>
			</view>

			<!-- 商品推荐 -->
			<view class="superior">
				<view class="title acea-row row-center-wrapper">
					<image src="http://mall-image.hxyrfwpt.com/static/images/ling.png" />
					<text class="titleTxt">优品推荐</text>
					<image src="http://mall-image.hxyrfwpt.com/static/images/ling.png" />
				</view>
				<template>
					<view class="slider-banner banner">
						<swiper :options="swiperRecommend" v-if="goodList.length > 0">
							<swiper-slide v-for="(item, eq2) in goodList" :key="eq2">
								<view class="list acea-row row-middle">
									<view class="item" v-for="val in item.list" :key="val.image">
										<view class="pictrue"><image :src="val.image" /></view>
										<view class="name line1">{{ val.store_name }}}</view>
										<view class="money font-color-red">¥{{ val.price }}</view>
									</view>
								</view>
							</swiper-slide>
							<view class="swiper-pagination" slot="pagination"></view>
						</swiper>
					</view>
				</template>
			</view>

			<!-- 商品详情 -->
			<view class="product-intro">
				<!--     <text class="title">产品介绍</text> -->
				<view class="conter" v-html="storeInfo.description"></view>
			</view>

			<view style="height: 150rpx"></view>
			<!-- 操作栏 -->
			<view class="footer acea-row row-between-wrapper">
				<!-- #ifdef MP-WEIXIN -->
				<!-- @click="goContact()" -->
				<view class="item">
					<button class="contacButton" open-type="contact">
						<view style="padding-bottom: 8rpx" class="item">
							<view class="iconfont icon-kefu"></view>
							<text>客服</text>
						</view>
					</button>
				</view>
				<!-- #endif -->
				
				<!-- 	<view class="item">
		  <button @click="goChat()" class="contacButton">
		    <view style="padding-bottom: 8rpx" class="item">
		      <view class="iconfont icon-kefu"></view>
		      <text>客服</text>
		    </view>
		  </button>
		</view> -->

				<view class="item" @click="goHome">
					<view class="iconfont icon-shouye-xianxing"></view>
					<text>首页</text>
				</view>
				<view class="item" @click="setCollect" v-if="collectdata == true">
					<view class="iconfont icon-shoucang1"></view>
					<text>收藏</text>
				</view>
				<view class="item" @click="setCollect" v-if="collectdata == false">
					<view class="iconfont icon-shoucang"></view>
					<text>收藏</text>
				</view>
				<view @click="goShoppingCart()" v-if="animated" class="item animated bounceIn">
					<view class="iconfont icon-gouwuche1">
						<text class="num " v-if="CartCount > 0">{{ CartCount }}</text>
					</view>
					<text>购物车</text>
				</view>
				<view @click="goShoppingCart()" class="item animated" v-if="!animated">
					<view class="iconfont icon-gouwuche1">
						<text class="num " v-if="CartCount > 0">{{ CartCount }}</text>
					</view>
					<text>购物车</text>
				</view>
				<view class="bnt acea-row">
					<view class="joinCart" @click="joinCart"><text>加入购物车</text></view>
					<view class="buy" @click="tapBuy"><text>立即购买</text></view>
				</view>

				<!-- 	<view class="bnt acea-row" v-if="showCartStatus==false ">
		  <view class="joinCart" @click="showCartStatusClick(1)" >
		    <text>赠送他人</text>
		  </view>
		  <view class="buy" @click="showCartStatusClick(0)">
		    <text>买给自己</text>
		  </view>
		</view>
		
		<view class="bnt acea-row" v-if="showCartStatus==false ">
		  
		  <view class="buy" @click="showCartStatusClick(0)" style="border-radius:50rpx;float: right;">
		    <text>买给自己</text>
		  </view>
		</view>
		 -->
			</view>

			<!-- 优惠券 -->
			<CouponPop v-on:changeFun="changeFun" :coupon="coupon"></CouponPop>
			<!-- 商品规格弹窗 -->
			<ProductWindow v-on:changeFun="changeFun" :attr="attr" :cartNum="cart_num"></ProductWindow>
			<!-- 分享海报 -->
			<StorePoster v-on:setPosterImageStatus="setPosterImageStatus" :posterImageStatus="posterImageStatus" :posterData="posterData" :goodId="id"></StorePoster>
			<!-- 分享弹窗 -->
			<ShareInfo v-on:setShareInfoStatus="setShareInfoStatus" :shareInfoStatus="shareInfoStatus"></ShareInfo>

			<view class="generate-posters acea-row row-middle on" v-if="posters">
				<view class="item" @click="setPosterImageStatus">
					<view class="iconfont icon-haibao"></view>
					<view>生成海报</view>
				</view>
			</view>
			<view class="generate-posters acea-row row-middle" v-if="!posters">
				<view class="item" @click="setPosterImageStatus">
					<view class="iconfont icon-haibao"></view>
					<view>生成海报</view>
				</view>
			</view>
			<view class="mask" @touchmove.prevent @click="listenerActionClose" v-show="posters"></view>
			<view class="posterCanvasWarp"><canvas class="posterCanvas" canvas-id="myCanvas"></canvas></view>
		</view>
	</view>
</template>

<script>
// import { swiper, swiperSlide } from "vue-awesome-swiper";

import ProductConSwiper from '@/components/ProductConSwiper';
import UserEvaluation from '@/components/UserEvaluation';
import CouponPop from '@/components/CouponPop';
import ProductWindow from '@/components/ProductWindow';
import StorePoster from '@/components/StorePoster';
import ShareInfo from '@/components/ShareInfo';
import { getProductDetail, getCollectDetail, postCartAdd, getCartCount, getProductCode } from '@/api/store';
import { getCoupon, getCollectAdd, getCollectDel, getUserInfo } from '@/api/user';
import cookie from '@/utils/store/cookie';
import { isWeixin, PosterCanvas, handleQrCode, handleUrlParam, getCurrentPageUrlWithArgs } from '@/utils';
import { wechatEvevt } from '@/libs/wechat';
import { imageBase64 } from '@/api/public';
import { mapGetters } from 'vuex';
import stringify from '../../../utils/querystring';

export default {
	name: 'GoodsCon',
	components: {
		// swiper,
		// swiperSlide,
		ProductConSwiper,
		UserEvaluation,
		CouponPop,
		ProductWindow,
		StorePoster,
		ShareInfo
	},
	data: function() {
		return {
			collectdata: '',
			showCartStatus: false,
			shareInfoStatus: false,
			showZengSongFlag: true,
			weixinStatus: false,
			mapShow: false,
			mapKey: '',
			posterData: {
				image: '',
				title: '',
				price: '',
				code: ''
			},
			posterImageStatus: false,
			animated: false,
			coupon: {
				coupon: false,
				list: []
			},
			attr: {
				cartAttr: false,
				productAttr: [],
				productSelect: {}
			},
			isOpen: false, //是否打开属性组件
			productValue: [],
			id: 0,
			storeInfo: {},
			couponList: [],
			attrTxt: '请选择',
			attrValue: '',
			cart_num: 1, //购买数量
			replyCount: '',
			replyChance: '',
			reply: [],
			priceName: 0,
			CartCount: 0,
			posters: false,
			banner: [{}, {}],
			swiperRecommend: {
				pagination: {
					el: '.swiper-pagination',
					clickable: true
				},
				autoplay: false,
				loop: false,
				speed: 1000,
				observer: true,
				observeParents: true
			},
			goodList: [],
			systemStore: {},
			merchantInfo: {},
			qqmapsdk: null,
			productConClass: 'product-con',
			tempName: '',
			parameters:[],
		};
	},
	computed: mapGetters(['isLogin', 'location']),
	mounted: function() {
		let that = this;
		this.$store.commit('get_to', 'goodcon');
		let url = handleQrCode();
		if (!url) {
			url = handleUrlParam(getCurrentPageUrlWithArgs());
		}

		if (url && url.id) {
			this.id = url.id;
			let urlSpread = parseInt(url.spread);
			if (urlSpread) {
				cookie.set('spread', urlSpread);
			}
		} else {
			this.id = this._route.query.id;
		}

		this.productCon();
		this.setOpenShare();

		this.CollectDetail();
	},
	watch: {
		posterImageStatus(status) {
			console.log(status);
			if (status) {
				this.productConClass = 'noscroll product-con';
			} else {
				this.productConClass = 'product-con';
			}
		},
		isOpen: function(val) {
			this.showCartStatus = val;
		}
	},
	methods: {
		goChat() {
			window.location.href = 'https://im.nodigmall.com/index/index/home?visiter_id=&visiter_name=&avatar=&business_id=1&groupid=0';
		},
		onShareAppMessage: function() {
			return {
				title: this.storeInfo.storeName,
				imageUrl: this.storeInfo.image,
				path: 'pages/shop/GoodsCon/index?id=' + this.storeInfo.id + '&spread=' + uni.getStorageSync('uid') + '&pageType=good&codeType=routine',
				success(res) {
					uni.showToast({
						title: '分享成功'
					});
				},
				fail(res) {
					uni.showToast({
						title: '分享失败',
						icon: 'none'
					});
				}
			};
		},
		goHome() {
			this.$yrouter.switchTab('/pages/home/index');
		},
		goShoppingCart() {
			this.$yrouter.switchTab('/pages/shop/ShoppingCart/index');
		},
		goContact() {
			console.log('..............');
			uni.showModal({
				title: '提示',
				content: '是否联系客服：19961898368',
				success: function(res) {
					if (res.confirm) {
						uni.makePhoneCall({
							phoneNumber: '19961898368',
							success: res => {
								console.log('调用成功');
							},
							fail() {
								console.log('调用失败');
							}
						});
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				}
			});

			// let contact = this.merchantInfo.userLink;
			//let contact ="http://mall-customservice.hxyrfwpt.com/index/index/home?visiter_id=&visiter_name=&avatar=&business_id=2&groupid=0&special=2" ;
			// if (contact == null) {
			// 	uni.showToast({
			// 		title: '客服小哥开小差去啦',
			// 		icon: 'none'
			// 	});
			// } else {
			// 此处填写你要跳转的绑定公众号文章的链接地址或者已经在小程序后台配置好业务域名的地址
			// var url = contact ;
			// uni.navigateTo({
			// 	// 此处的链接为小程序上面新建的webview页面路径，参数url为要跳转外链的地址
			// 	url:"/pages/ship/GoodsCon/others?url=" + encodeURIComponent(url)
			// });
			//
			// this.$yrouter.push({
			// 	path: '/pages/shop/GoodsCon/other',
			// 	query: {
			// 		url: encodeURIComponent(contact)
			// 	}
			// });
			// }

			// 	let contact=this.merchantInfo.logoUrl;
		},
		goCustomerList() {
			this.$yrouter.push({
				path: '/pages/user/CustomerList/index'
			});
		},
		goStoreList() {
			this.$yrouter.push({
				path: '/pages/shop/StoreList/index'
			});
		},
		goShopAllList() {
			//进入商户全部商品列表
			var merId = this.merchantInfo.id;
			var merchantName = this.merchantInfo.merchantName;
			this.$yrouter.push({
				path: '/pages/shop/GoodsList/index',
				query: {
					merId,
					merchantName
				}
			});
		},
		goEvaluateList(id) {
			this.$yrouter.push({
				path: '/pages/shop/EvaluateList/index',
				query: {
					id
				}
			});
		},
		telPhone(phoneNumber) {
			uni.makePhoneCall({
				phoneNumber: phoneNumber,
				fail() {
					console.log('取消拨打');
				}
			});
		},
		showChang: function(data) {
			this.$yrouter.push({
				path: '/pages/map/index',
				query: data
			});
		},
		updateTitle() {
			// document.title = this.storeInfo.storeName || this.$yroute.meta.title;
		},
		setShareInfoStatus: function() {
			this.shareInfoStatus = !this.shareInfoStatus;
			this.posters = false;
		},
		shareCode: function() {
			var that = this;
			getProductCode(that.id).then(res => {
				that.posterData.code = res.data.code;
				that.listenerActionSheet();
			});
		},
		setPosterImageStatus: function() {
			this.posterImageStatus = !this.posterImageStatus;
			this.posters = false;
		},
		//产品详情接口；
		productCon: function() {
			let that = this;
			let from = this.location;
			if (this.$deviceType == 'app') {
				from.from = 'app';
			}
			uni.showLoading({
				title: '加载中',
				mask: true
			});
			getProductDetail(that.id, from)
				.then(res => {
					res.data.storeInfo.description = res.data.storeInfo.description.replace(/\<img/gi, '<img style="max-width:100%;height:auto;"');
					this.parameters = JSON.parse(res.data.storeInfo.parameters)
					that.$set(that, 'storeInfo', res.data.storeInfo);
					
					console.log(that.storeInfo.userCollect);
					// 给 attr 赋值，将请求回来的规格赋值给 attr
					that.$set(that.attr, 'productAttr', res.data.productAttr);
					that.$set(that, 'productValue', res.data.productValue);
					that.$set(that, 'replyCount', res.data.replyCount);
					that.$set(that, 'replyChance', res.data.replyChance);
					that.reply = res.data.reply ? [res.data.reply] : [];
					that.$set(that, 'reply', that.reply);
					that.$set(that, 'priceName', res.data.priceName);
				
					// that.$set(that, "tempName", res.data.tempName);
					if (that.storeInfo.shippingType && that.storeInfo.shippingType == 2) {
						that.$set(that, 'tempName', '门店自提');
					} else if (that.storeInfo.shippingType && that.storeInfo.shippingType == 1) {
						that.$set(that, 'tempName', '邮寄');
					} else {
						that.$set(that, 'tempName', ' 邮寄  / 门店自提');
					}

					// else{
					//  that.$set(that, "tempName", res.data.tempName);
					// }

					that.posterData.image = that.storeInfo.image;
					if (that.storeInfo.storeName.length > 30) {
						that.posterData.title = that.storeInfo.storeName.substring(0, 30) + '...';
					} else {
						that.posterData.title = that.storeInfo.storeName;
					}
					that.posterData.price = that.storeInfo.price;
					that.posterData.code = that.storeInfo.codeBase;
					that.systemStore = res.data.systemStore;
					//商户信息
					that.merchantInfo = res.data.merchantInfo;
					//配送方式 1=快递 ，2=门店自提 3:全部
					if (res.data.storeInfo.shippingType && res.data.storeInfo.shippingType == 2) {
						this.showZengSongFlag = false;
					}

					let good_list = res.data.goodList || [];
					let goodArray = [];
					let count = Math.ceil(good_list.length / 6);
					for (let i = 0; i < count; i++) {
						var list = good_list.slice(i * 6, 6);
						if (list.length)
							goodArray.push({
								list: list
							});
					}
					that.mapKay = res.data.mapKay;
					that.$set(that, 'goodList', goodArray);
					that.updateTitle();
					that.DefaultSelect();
					that.getCartCount();
					that.coupons();
				})
				.catch(err => {
					uni.showToast({
						title: err.msg || err.response.data.msg || err.response.data.message,
						icon: 'none',
						duration: 2000
					});
				})
				.finally(() => {
					uni.hideLoading();
				});
		},
		//默认选中属性；
		DefaultSelect: function() {
			let productAttr = this.attr.productAttr;
			let value = [];
			for (let i = 0; i < productAttr.length; i++) {
				this.$set(productAttr[i], 'index', 0);
				value.push(productAttr[i].attrValueArr[0]);
			}
			//sort();排序函数:数字-英文-汉字；
			let productSelect = this.productValue[value.sort().join(',')];
			if (productSelect && productAttr.length) {
				this.$set(this.attr.productSelect, 'store_name', this.storeInfo.storeName);
				this.$set(this.attr.productSelect, 'image', productSelect.image);
				this.$set(this.attr.productSelect, 'price', productSelect.price);
				this.$set(this.attr.productSelect, 'stock', productSelect.stock);
				this.$set(this.attr.productSelect, 'unique', productSelect.unique);
				this.$set(this.attr.productSelect, 'cart_num', 1);
				this.$set(this, 'attrValue', value.sort().join(','));
				this.$set(this, 'attrTxt', '已选择');
			} else if (!productSelect && productAttr.length) {
				this.$set(this.attr.productSelect, 'store_name', this.storeInfo.storeName);
				this.$set(this.attr.productSelect, 'image', this.storeInfo.image);
				this.$set(this.attr.productSelect, 'price', this.storeInfo.price);
				this.$set(this.attr.productSelect, 'stock', 0);
				this.$set(this.attr.productSelect, 'unique', '');
				this.$set(this.attr.productSelect, 'cart_num', 0);
				this.$set(this, 'attrValue', '');
				this.$set(this, 'attrTxt', '请选择');
			} else if (!productSelect && !productAttr.length) {
				this.$set(this.attr.productSelect, 'store_name', this.storeInfo.storeName);
				this.$set(this.attr.productSelect, 'image', this.storeInfo.image);
				this.$set(this.attr.productSelect, 'price', this.storeInfo.price);
				this.$set(this.attr.productSelect, 'stock', this.storeInfo.stock);
				this.$set(this.attr.productSelect, 'unique', this.storeInfo.unique || '');
				this.$set(this.attr.productSelect, 'cart_num', 1);
				this.$set(this, 'attrValue', '');
				this.$set(this, 'attrTxt', '请选择');
			}
		},
		//购物车；
		ChangeCartNum: function(changeValue) {
			//changeValue:是否 加|减
			//获取当前变动属性
			let productSelect = this.productValue[this.attrValue];
			//如果没有属性,赋值给商品默认库存
			if (productSelect === undefined && !this.attr.productAttr.length) {
				productSelect = this.attr.productSelect;
			}
			//无属性值即库存为0；不存在加减；
			if (productSelect === undefined) return;
			let stock = productSelect.stock || 0;
			let num = this.attr.productSelect;
			if (changeValue) {
				num.cart_num++;
				if (num.cart_num > stock) {
					this.$set(this.attr.productSelect, 'cart_num', stock);
					this.$set(this, 'cart_num', stock);
				} else {
					this.$set(this.attr.productSelect, 'cart_num', num.cart_num);
					this.$set(this, 'cart_num', num.cart_num);
				}
			} else {
				num.cart_num--;
				if (num.cart_num < 1) {
					this.$set(this.attr.productSelect, 'cart_num', 1);
					this.$set(this, 'cart_num', 1);
				} else {
					this.$set(this.attr.productSelect, 'cart_num', num.cart_num);
					this.$set(this, 'cart_num', num.cart_num);
				}
			}
		},
		//将父级向子集多次传送的函数合二为一；
		changeFun: function(opt) {
			if (typeof opt !== 'object') opt = {};
			let action = opt.action || '';
			let value = opt.value === undefined ? '' : opt.value;
			this[action] && this[action](value);
		},
		//打开优惠券插件；
		couponTap: function() {
			let that = this;
			that.coupons();
			that.coupon.coupon = true;
		},
		changecoupon: function(msg) {
			this.coupon.coupon = msg;
			this.coupons();
		},
		currentcoupon: function(res) {
			let that = this;
			that.coupon.coupon = false;
			that.$set(that.coupon.list[res], 'is_use', true);
		},
		//可领取优惠券接口；
		coupons: function() {
			let that = this,
				q = {
					page: 1,
					limit: 20,
					productId: that.storeInfo.id
				};
			getCoupon(q).then(res => {
				that.$set(that, 'couponList', res.data || []);
				that.$set(that.coupon, 'list', res.data);
			});
		},
		//打开属性插件；
		selecAttrTap: function() {
			this.attr.cartAttr = true;
			this.isOpen = true;
		},
		changeattr: function(msg) {
			// 修改了规格
			console.log(msg);
			this.attr.cartAttr = msg;
			this.isOpen = false;
		},
		//选择属性；
		ChangeAttr: function(res) {
			// 修改了规格

			let productSelect = this.productValue[res.value];
			console.log(productSelect);
			if (productSelect) {
				this.attr.productAttr[res.indexw].index = res.indexn;
				this.$set(this.attr.productSelect, 'image', productSelect.image);
				this.$set(this.attr.productSelect, 'price', productSelect.price);
				this.$set(this.attr.productSelect, 'stock', productSelect.stock);
				this.$set(this.attr.productSelect, 'unique', productSelect.unique);
				this.$set(this.attr.productSelect, 'cart_num', 1);
				this.$set(this, 'attrValue', res.value);
				this.$set(this, 'attrTxt', '已选择');
			} else {
				this.$set(this.attr.productSelect, 'image', this.storeInfo.image);
				this.$set(this.attr.productSelect, 'price', this.storeInfo.price);
				this.$set(this.attr.productSelect, 'stock', 0);
				this.$set(this.attr.productSelect, 'unique', '');
				this.$set(this.attr.productSelect, 'cart_num', 0);
				this.$set(this, 'attrValue', '');
				this.$set(this, 'attrTxt', '请选择');
			}
		},
		//收藏商品
		setCollect: function() {
			let that = this,
				id = that.storeInfo.id,
				category = 'collect';
			console.log(that.storeInfo.userCollect);
			if (that.collectdata) {
				getCollectDel(id, category).then(function() {
					that.collectdata = !that.collectdata;
				});
			} else {
				getCollectAdd(id, category).then(function() {
					that.collectdata = !that.collectdata;
				});
			}
		},
		CollectDetail() {
			let that = this;
			console.log(this.id);
			getCollectDetail(this.id).then(res => {
				that.collectdata = res.data;
				console.log('1111111111111111', that.collectdata);
				// that.$set(this.collectdata,res.data);
			});
			// console.log(this.collectdata)
		},

		showCartStatusClick(order_tag) {
			this.showCartStatus = true;
			sessionStorage.setItem('order_tag', order_tag);
			this.goCat(1);
		},
		//  点击加入购物车按钮
		joinCart: function() {
			//0=加入购物车
			this.goCat(0);
		},
		// 加入购物车；
		goCat: function(news) {
			let that = this,
				productSelect = that.productValue[this.attrValue];
			//打开属性
			if (that.attrValue) {
				//默认选中了属性，但是没有打开过属性弹窗还是自动打开让用户查看默认选中的属性
				that.attr.cartAttr = !that.isOpen ? true : false;
			} else {
				if (that.isOpen) that.attr.cartAttr = true;
				else that.attr.cartAttr = !that.attr.cartAttr;
			}
			//只有关闭属性弹窗时进行加入购物车
			if (that.attr.cartAttr === true && that.isOpen === false) return (that.isOpen = true);
			//如果有属性,没有选择,提示用户选择
			if (that.attr.productAttr.length && productSelect === undefined && that.isOpen === true) {
				uni.showToast({
					title: '产品库存不足，请选择其它',
					icon: 'none',
					duration: 2000
				});
				return;
			}
			let q = {
				productId: that.id,
				cartNum: that.attr.productSelect.cart_num,
				new: news,
				uniqueId: that.attr.productSelect !== undefined ? that.attr.productSelect.unique : ''
			};

			postCartAdd(q)
				.then(function(res) {
					that.isOpen = false;
					that.attr.cartAttr = false;
					if (news) {
						if (!res.data) {
							uni.showToast({
								title: res.msg || res.data.msg || res.data.message,
								icon: 'none',
								duration: 2000
							});
							return;
						}
						that.$yrouter.push({
							path: '/pages/order/OrderSubmission/index',
							query: {
								id: res.data.cartId
							}
						});
					} else {
						uni.showToast({
							title: '添加购物车成功',
							icon: 'success',
							duration: 2000,
							complete: () => {
								that.getCartCount(true);
							}
						});
					}
				})
				.catch(error => {
					that.isOpen = false;
					uni.showToast({
						// title: error.response.data.msg,
						title: '产品库存不足',
						icon: 'none',
						duration: 2000
					});
				});
		},
		//获取购物车数量
		getCartCount: function(isAnima) {
			let that = this;
			const isLogin = that.isLogin;
			if (isLogin) {
				getCartCount({
					numType: 0
				}).then(res => {
					that.CartCount = res.data.count;
					//加入购物车后重置属性
					if (isAnima) {
						that.animated = true;
						setTimeout(function() {
							that.animated = false;
						}, 500);
					}
				});
			}
		},
		//立即购买；
		tapBuy: function() {
			//  1=直接购买
			this.goCat(1);
		},
		listenerActionSheet: function() {
			if (isWeixin() === true) {
				this.weixinStatus = true;
			}
			this.posters = true;
		},
		listenerActionClose: function() {
			this.posters = false;
		},
		setOpenShare: function() {
			var data = this.storeInfo;
			var href = this.location.href;
			if (this.$deviceType == 'weixin') {
				if (this.isLogin) {
					getUserInfo().then(res => {
						href = href.indexOf('?') === -1 ? href + '?spread=' + res.data.uid : href + '&spread=' + res.data.uid;
						var configAppMessage = {
							desc: data.storeInfo,
							title: data.storeName,
							link: href,
							imgUrl: data.image
						};
						wechatEvevt(['updateAppMessageShareData', 'updateTimelineShareData'], configAppMessage)
							.then(res => {})
							.catch(res => {
								if (res.is_ready) {
									res.wx.updateAppMessageShareData(configAppMessage);
									res.wx.updateTimelineShareData(configAppMessage);
								}
							});
					});
				} else {
					var configAppMessage = {
						desc: data.storeInfo,
						title: data.storeName,
						link: href,
						imgUrl: data.image
					};
					wechatEvevt(['updateAppMessageShareData', 'updateTimelineShareData'], configAppMessage)
						.then(res => {})
						.catch(res => {
							if (res.is_ready) {
								res.wx.updateAppMessageShareData(configAppMessage);
								res.wx.updateTimelineShareData(configAppMessage);
							}
						});
				}
			}
		}
	}
};
</script>

<style scoped lang="less">
.geoPage {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	z-index: 10000;
}

.wrapper {
	background-color: #fff;
}

.attribute.acea-row.row-between-wrapper {
	background-color: #fff;
}

.product-con .store-info {
	// margin-top: 0.2 * 100rpx;
	background-color: #fff;
}

.product-con .store-info .title {
	padding: 0 0.3 * 100rpx;
	font-size: 0.28 * 100rpx;
	color: #282828;
	height: 0.8 * 100rpx;
	line-height: 0.8 * 100rpx;
	border-bottom: 0.01 * 100rpx solid #f5f5f5;
}

.product-con .store-info .info {
	padding: 0 0.3 * 100rpx;
	height: 1.26 * 100rpx;
}

.product-con .store-info .info .picTxt {
	width: 100%;
	display: flex;
	align-items: center;
}

.product-con .store-info .info .picTxt .pictrue {
	width: 0.76 * 100rpx;
	height: 0.76 * 100rpx;
	margin-right: 0.2 * 100rpx;
}

.product-con .store-info .info .picTxt .pictrue image {
	width: 100%;
	height: 100%;
	border-radius: 0.06 * 100rpx;
}

.product-con .store-info .info .picTxt .text {
	flex: 1;
}

.product-con .store-info .info .picTxt .text .name {
	font-size: 0.3 * 100rpx;
	color: #282828;
}

.product-con .store-info .info .picTxt .text .address {
	font-size: 0.24 * 100rpx;
	color: #666;
	margin-top: 0.03 * 100rpx;
}

.product-con .store-info .info .picTxt .text .address .iconfont {
	color: #707070;
	font-size: 0.18 * 100rpx;
	margin-left: 0.1 * 100rpx;
}

.product-con .store-info .info .picTxt .addressBox {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.product-con .store-info .info .picTxt .addressBox .iconfont {
	font-size: 0.4 * 100rpx;
}

.product-con .store-info .info .picTxt .addressBox .addressTxt {
	font-size: 0.24 * 100rpx;
	color: #eb3729;
}

.product-con .store-info .praise {
	font-size: 0.28 * 100rpx;
	color: #808080;
}

.product-con .store-info .praise .iconfont {
	font-size: 0.28 * 100rpx;
}

.product-con .superior {
	background-color: #fff;
	// margin-top: 0.2 * 100rpx;
}

.product-con .superior .title {
	height: 0.98 * 100rpx;
}

.product-con .superior .title image {
	width: 0.3 * 100rpx;
	height: 0.3 * 100rpx;
}

.product-con .superior .title .titleTxt {
	margin: 0 0.2 * 100rpx;
	font-size: 0.3 * 100rpx;
	background-image: linear-gradient(to right, #f57a37 0%, #f21b07 100%);
	background-image: -webkit-linear-gradient(to right, #f57a37 0%, #f21b07 100%);
	background-image: -moz-linear-gradient(to right, #f57a37 0%, #f21b07 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.product-con .superior .slider-banner {
	width: 6.9 * 100rpx;
	margin: 0 auto;
	padding-bottom: 0.2 * 100rpx;
}

.product-con .superior .slider-banner .list {
	width: 100%;
	padding-bottom: 0.2 * 100rpx;
}

.product-con .superior .slider-banner .list .item {
	width: 2.15 * 100rpx;
	margin: 0 0.22 * 100rpx 0.3 * 100rpx 0;
	font-size: 0.26 * 100rpx;
}

.product-con .superior .slider-banner .list .item:nth-of-type(3n) {
	margin-right: 0;
}

.product-con .superior .slider-banner .list .item .pictrue {
	width: 100%;
	height: 2.15 * 100rpx;
}

.product-con .superior .slider-banner .list .item .pictrue image {
	width: 100%;
	height: 100%;
	border-radius: 0.06 * 100rpx;
}

.product-con .superior .slider-banner .list .item .name {
	color: #282828;
	margin-top: 0.12 * 100rpx;
}

.product-con .superior .slider-banner .swiper-pagination-bullet {
	background-color: #999;
}

.product-con .superior .slider-banner .swiper-pagination-bullet-active {
	background-color: #e93323;
}

.mask {
	-webkit-filter: blur(2px);
	-moz-filter: blur(2px);
	-ms-filter: blur(2px);
	filter: blur(2px);
}

.product-con .product-intro .conter view {
	width: 100% !important;
}

.generate-posters {
	width: 100%;
	height: 1.7 * 100rpx;
	// background-color: #aec5b5;
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 99;
	transform: translate3d(0, 100%, 0);
	-webkit-transform: translate3d(0, 100%, 0);
	-ms-transform: translate3d(0, 100%, 0);
	-moz-transform: translate3d(0, 100%, 0);
	-o-transform: translate3d(0, 100%, 0);
	transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	-o-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}

.generate-posters.on {
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
}

.generate-posters .item {
	flex: 50%;
	-webkit-flex: 50%;
	-ms-flex: 50%;
	text-align: center;
}

.generate-posters .item .iconfont {
	font-size: 0.8 * 100rpx;
	color: #5eae72;
}

.generate-posters .item .iconfont.icon-haibao {
	color: #5391f1;
}

.noscroll {
	height: 100%;
	overflow: hidden;
}

.zkj {
	// color:  #ffdf00;
	color: #2b4a39;
	font-size: 20rpx;
}
.canshu {
	width: 95%;
	margin:14rpx auto;
	border: 1px solid #eee;
}
.canshu-q{
	display: flex;
	font-size: 24rpx;
	color: #333;
	line-height: 65rpx;
	border-bottom: 1px solid #eee;
}
//选择class最后一个
.canshu-q:last-of-type{
		border-bottom: none;
	}

.canshu-w{
	width: 220rpx;
	height: 65rpx;
	margin-left: 24rpx;
	border-right: 1px solid #eee;
	
}
.canshu-r{
	width: 480rpx;
	height: 65rpx;
	margin-left: 24rpx;
}
</style>

